<template>
  <div class="sidebar-container">
    <!-- unique-opened -->
    <el-scrollbar wrap-class="scrollbar-wrapper">
      <el-menu
        style="font: 20px '楷体'"
        :default-active="$route.path"
        class="el-menu-vertical-demo"
        :default-openeds="$store.state.openMenus"
        router
        unique-opened
        :collapse="$store.state.isCollapse"
        background-color="#545c64"
        text-color="#bfcbd9"
        active-text-color="#409EFF"
      >
        <img class="img-logo" src="../../assets/user.svg" />
        <!-- <div class="div-title">智慧园区管理系统</div> -->
        <sidebaritem
          v-for="menu in menuList"
          :key="menu.path"
          :item="menu"
          :rootName="''"
          :rootPath="''"
        />
      </el-menu>
    </el-scrollbar>
  </div>
</template>

<script>
import sidebarItem from "./sidebarItem.vue";

export default {
  name: "Sidebar",
  data() {
    return {};
  },
  components: {
    sidebaritem: sidebarItem,
  },
  props: {
    menuList: {
      type: Array,
      required: true,
    },
  },
};
</script>
<style  scoped>
.img-logo {
  padding-top: 8px;
  width: 38px;
  height: 38px;
}
.div-title{
  color:white;
}
</style>